<template>
	<view class="nav-bar-main">
		<view class="nav-status"></view>
		<view class="nav-bar">
			<view class="nav-back" v-if="isBack" @click="back">
				<uni-icons type="left" size="30" color="#fff"></uni-icons>
			</view>
			<view class="nav-title">{{title}}</view>
		</view>
	</view>
</template>

<script>
	export default {
		name:"customNavBar",
		props:{
			isBack:{
				type:Boolean,
				default:true
			},
			title:String
		},
		data() {
			return {
				
			};
		},
		methods:{
			back(){
				uni.navigateBack()
			}
		}
	}
</script>

<style lang="scss" scoped>
	.nav-bar-main{
		width: 100%;
		height: 160upx;
		background-color: #008700;
		.nav-status{
			width: 100%;
			height: 60upx;
		}
	}
.nav-bar{
	width: 100%;
	height: 100upx;
	position: relative;
	.nav-back{
		width: 80upx;
		line-height: 100upx;
		text-align: center;
		position: absolute;
		left: 0;
		top: 0;
	}
	.nav-title{
		width: 70%;
		line-height: 100upx;
		color: #fff;
		font-size: 32upx;
		text-align: center;
		font-weight: bold;
		letter-spacing: 4upx;
		margin: auto;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
}
</style>